<template>
    <n-button quaternary @click="changeTheme" title="主题">
        <n-icon size="18" :depth="1">
            <moon-icon v-if="themeStore.getDarkTheme"></moon-icon>
            <sunny-icon v-else></sunny-icon>
        </n-icon>
    </n-button>
</template>

<script setup lang="ts">
import {useThemeStore} from '@/stores';
import {Moon as MoonIcon, Sunny as SunnyIcon} from '@vicons/ionicons5'

const themeStore = useThemeStore()

const changeTheme = () => {
    themeStore.changeTheme()
}

</script>
